<template>
    <div style="height: 81vh;">

 
    <div> 
        <div>
            <el-table
                :data="charts"
                stripe
                style=" margin-left: 10vw; margin-top: 2vh; width: 80vw">
                <el-table-column
                prop="id"
                label="序号"
                width="100">
                </el-table-column>
                <el-table-column
                prop="username"
                label="用户"
                width="100">
                </el-table-column>
                <el-table-column
                prop="take"
                label="留言内容"
                width="700">
                </el-table-column>
                <el-table-column label="操作">
                <template #default="scope">
                    <el-button
                    size="mini"
                    @click="delet(scope.$index)">下架</el-button>
                    <el-button
                    size="mini"
                    @click="ok(scope.$index)">通过</el-button>
                </template>
                
                </el-table-column>
            </el-table>
    
        </div>
       
</div>
<div style="height: 10vh;"></div>
</div>
</template>

<script>
import $ from "jquery";
import { ref } from "vue";
import { useStore } from "vuex";
export default {
    setup(){

        let store = useStore();
        let charts = ref([]);

        const info =()=>{
            $.ajax({
                url:"http://localhost:3000/api/take/getselet/",
                type:"get",
                headers:{
                    Authorization: "Bearer "+store.state.user.token,//授权 
                    //Authentication 认证  
                },
                success(resp){
                    charts.value = resp;
                    console.log(charts)                  
                }
                })
        }
        info()
        const delet = (index)=>{
            $.ajax({
                url:"http://localhost:3000/api/take/delet/",
                type:"post",
                headers:{
                    Authorization: "Bearer "+store.state.user.token,//授权 
                    //Authentication 认证  
                },  
                data:{
                      id:charts.value[index].id
                    },
                success(resp){
                    console.log(resp)
                }
                })
        }
        const ok = (index)=>{
            $.ajax({
                url:"http://localhost:3000/api/take/ok/",
                type:"post",
                headers:{
                    Authorization: "Bearer "+store.state.user.token,//授权 
                    //Authentication 认证  
                },  
                data:{
                      id:charts.value[index].id
                    },
                success(resp){
                  console.log(resp)
                }
                })
        }

        
        
        return{
            charts,
            delet,
            ok,
    }

    }
}
</script>


<style scoped>

</style>